@import "../lib/px2rem.scss";

.tabBox{
	display:flex;
	flex-direction:column;
	padding-left:px2rem(15);
	padding-right:px2rem(15);
	width:100%;
	box-sizing:border-box;
	background:#fff;
	.tab{
		width:100%;
		height:px2rem(45);
		line-height:px2rem(40);
		border-bottom:1px solid #fe6e00;
		a{
			float:left;
			display:block;
			text-align:center;
			width:50%;
			font-size:px2rem(16);
			border-bottom:px2rem(5) solid transparent;
			&.active{
				color: #fe6e00;
				border-bottom:px2rem(5) solid #fe6e00;
			}
			p{	
				color:#666;	
				height:px2rem(45);
				
				display:block;
				height:100%;
				text-decoration:none;	
			}
		}
	}
	.content{
		flex:1;
		height:100%;
		li{
			height:px2rem(125);
			padding-top:px2rem(20);
			padding-bottom:px2rem(20);
			border-top:px2rem(1) dashed #c9c9c9;
			box-sizing:border-box;
			&:first-child{
				border-top:none;
			}
			img{
				float:left;
				width:px2rem(60);
				height:100%;
				margin-right:px2rem(15);
			}
			.content_right{
				float:left;
				width:70%;
				h3{
					color:#000;
					line-height:px2rem(32);
					overflow:hidden;
					font-weight:normal;
					font-size:px2rem(16);
					.name{
						float:left;
						width:80%;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}
					.grade{
						float:right;
						color:#fc7103;
					}
					i{
						float:right;
						font-size:px2rem(15);
						position:relative;
						top:px2rem(1);
						color:#c6c6c6;
					}
				}
				p{
					line-height:px2rem(24);
					color:#8e8e8e;
					height:px2rem(24);
					font-size:px2rem(12);
					&:nth-of-type(1){
						overflow:hidden;
						text-overflow:ellipsis;
						white-space:nowrap;
					}
					span{
						color:#8aa2bf;
						&.person_num{
							margin-left:px2rem(30)
						}
						&.time{
							color:#ffb375;
						}
						&.week{
							margin-left:px2rem(15);
						}
					}
				}
			}
		}
	}
}